'use strict'
 import React    from "react";
 import {render} from 'react-dom';
 import {Link}   from 'react-router';
 
 import MMALL_COM from 'util/comm.jsx';
 import USER from 'service/user_service.jsx';

 var _comm = new MMALL_COM();
 var _user = new USER();
 class Login extends React.Component{
    constructor(props){
        super(props);
        this.state={
            username : '',
            password : '',
            redirect : _comm.getUrlParam('redirect')||'#/home'
        };
        this.onLogin       = this.onLogin.bind(this);
        this.onInputChange = this.onInputChange.bind(this);

    }
    componentDidMount(){

    }
    onInputChange(e){
        let ele    = e.target;
        let inputValue = ele.value,
        inputName  = ele.name;
        this.setState({
            [inputName]:inputValue
        })
    }
    onLogin(e){
        e.preventDefault();
        let userInfo={
            username : this.state.username,
            password : this.state.password
        }
        var res=_user.checkUserInfo(userInfo);
        if(res.status){
            _user.login(userInfo).then(res=>{
                _comm.setStorage('userInfo',res);
                window.location.href=this.state.redirect;
            },
            msg=>{
                _comm.errorTip(msg);
            })
        }
        else{
            _comm.errorTip(res.msg);
        }
    }
    render(){
        return (
            <div className="row">
                <div className="col-md-4 col-md-offset-4">
                    <div className="login-panel panel panel-default">
                        <div className="panel-heading">
                            <h3 className="panel-title">请登录</h3>
                        </div>
                        <div className="panel-body">
                            <form role="form" onSubmit={this.onLogin}>
                                <div className="form-group">
                                    <input className="form-control" 
                                        placeholder="User Name" 
                                        name="username" 
                                        type="text" 
                                        autoComplete="off" 
                                        autoFocus 
                                        onChange={this.onInputChange}/>
                                </div>
                                <div className="form-group">
                                    <input className="form-control" 
                                        placeholder="Password" 
                                        name="password" 
                                        type="password" 
                                        onChange={this.onInputChange}/>
                                </div>
                                <button type="submit" className="btn btn-lg btn-primary btn-block">Login</button>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        );
    }
 }
 export default Login;
